<template>
	<view class="comment-input">
		<u--input
				v-model="value"
			    :placeholder="placeholder"
			    suffixIcon="chat"
			    suffixIconStyle="color: #909399"
				@confirm="confirm"
			></u--input>
	</view>
</template>

<script>
	import {getProvince} from '@/utils/tools.js';
	const db = uniCloud.database();
	const utilsObj = uniCloud.importObject("utilsObj",{customUI:true});
	export default {
		name:"comment-input",
		props:{
			commentObj:{
				type:Object,
				default:()=>({})
			},
			placeholder:{
				type:String,
				default:'评论点什么吧～'
			}
		},
		data() {
			return {
				value:''
			};
		},
		methods:{
			async confirm(value){
				if(!value) return uni.showToast({
					title:"内容不能为空",
					icon:"none"
				})
				let province = await getProvince();
				db.collection("circle-comment").add({
					...this.commentObj,
					comment_content:this.value,
					province
				}).then(res=>{
					uni.showToast({
						title:"评论成功",
						icon:"none"
					})
					this.$emit("commentEvent",{
						_id:res.result.id,
						comment_content:this.value,
						province,
						comment_date:Date.now()
					})
					this.value = ''
					utilsObj.operation("circle-articles","comment_count",this.commentObj.article_id,1)
					
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.comment-input{
		background-color: #fff;
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		overflow: hidden;
		padding: 0 30rpx;
		box-sizing: border-box;
	}
</style>